<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/vant.css" />
</head>
<style>
    html,
    body {
        background-color: #fbf9f9;
    }

    .items {
        width: 100%;

    }

    .items .item {
        width: 100%;
        background-color: #fff;
        margin-top: 0.5rem;
    }

    .items .item .title {
        padding: 0 0.5rem;
        height: 1.5rem;
        line-height: 1.5rem;
        border-bottom: 1px solid #fbf9f9;
        font-size: 0.7rem;
    }

    .items .item .title .time {
        float: right;
        color: #2780e8;
    }

    .items .item .main {
        width: 100%;
    }

    .items .item .main span {
        padding: 0.2rem 0.4rem;
        border: 1px solid #cecece;
        border-radius: 0.2rem;
        font-size: 0.6rem;
        color: #cecece;
        margin: 0.5rem;
    }

    .items .item .main .info {
        font-size: 0.7rem;
        color: #333;
        margin: 0 0.5rem 0.5rem 0.5rem;
    }

    .items .item .bottomDiv {
        border-top: 1px solid #cecece;
        line-height: 1.5rem;
        height: 1.5rem;
        width: 100%;
    }

    .items .item .bottomDiv span {
        height: 1rem;
        line-height: 1rem;
        font-size: 0.7rem;
        color: #fff;
        padding: 0 0.3rem;
        background-color: #2780e8;
        border-radius: 0.3rem;
        margin: 0.25rem 0.5rem 0.25rem 0;
        float: right;
    }

    .none {
        text-align: center;
        padding: 0.8rem 0;
        font-size: 0.8rem;
    }
</style>

<body>
    <div id="app" v-cloak>
        <van-tabs v-model="activeName" @click="status" sticky>
            <van-tab title="待处理" name="1">
                <div class="items" v-for="item in list">
                    <div class="item">
                        <p class="title">
                            {{item.patient}} | <span v-if="item.sex == 1">男</span><span
                                v-else-if="item.sex == 2">女</span><span v-else>未知</span> | {{item.age}}岁
                            <span class="time" v-if="item.payTime">支付时间:{{item.payTime}}</span>
                        </p>
                        <div class="main">
                            <span v-if="item.servicesName == 'image'">图文问诊</span>
                            <span v-if="item.servicesName == 'audio'">语音问诊</span>
                            <span v-if="item.servicesName == 'video'">视频问诊</span>
                            <p class="info">病情描述：{{item.diseaseInfo}}</p>
                        </div>
                        <div class="bottomDiv">
                            <span @click="change(item.id,item.userId)">立即处理</span>
                        </div>
                    </div>
                </div>
            </van-tab>
            <van-tab title="进行中" name="2">
                <div class="items" v-for="item in list">
                    <div class="item">
                        <p class="title">
                            {{item.patient}} | <span v-if="item.sex == 1">男</span><span
                                v-else-if="item.sex == 2">女</span><span v-else>未知</span> | {{item.age}}岁
                            <span class="time" v-if="item.payTime">支付时间:{{item.payTime}}</span>
                        </p>
                        <div class="main">
                            <span v-if="item.servicesName == 'image'">图文问诊</span>
                            <span v-if="item.servicesName == 'audio'">语音问诊</span>
                            <span v-if="item.servicesName == 'video'">视频问诊</span>
                            <p class="info">病情描述：{{item.diseaseInfo}}</p>
                        </div>
                        <div class="bottomDiv">
                            <span @click="goChat(item)">进入问诊</span>
                        </div>
                    </div>
                </div>
            </van-tab>
            <van-tab title="已完成" name="3">
                <div class="items" v-for="item in list">
                    <div class="item">
                        <p class="title">
                            {{item.patient}} | <span v-if="item.sex == 1">男</span><span
                                v-else-if="item.sex == 2">女</span><span v-else>未知</span> | {{item.age}}岁
                            <span class="time" v-if="item.payTime">支付时间:{{item.payTime}}</span>
                        </p>
                        <div class="main">
                            <span v-if="item.servicesName == 'image'">图文问诊</span>
                            <span v-if="item.servicesName == 'audio'">语音问诊</span>
                            <span v-if="item.servicesName == 'video'">视频问诊</span>
                            <p class="info">病情描述：{{item.diseaseInfo}}</p>
                        </div>
                        <div class="bottomDiv">
                            <!-- <span>立即处理</span> -->
                        </div>
                    </div>
                </div>
            </van-tab>
            <van-tab title="已取消" name="-1">
                <div class="items" v-for="item in list">
                    <div class="item">
                        <p class="title">
                            {{item.patient}} | <span v-if="item.sex == 1">男</span><span
                                v-else-if="item.sex == 2">女</span><span v-else>未知</span> | {{item.age}}岁
                            <span class="time" v-if="item.payTime">支付时间:{{item.payTime}}</span>
                        </p>
                        <div class="main">
                            <span v-if="item.servicesName == 'image'">图文问诊</span>
                            <span v-if="item.servicesName == 'audio'">语音问诊</span>
                            <span v-if="item.servicesName == 'video'">视频问诊</span>
                            <p class="info">病情描述：{{item.diseaseInfo}}</p>
                        </div>
                        <div class="bottomDiv">
                            <!-- <span>立即处理</span> -->
                        </div>
                    </div>
                </div>
            </van-tab>
            <!-- <div class="none">
                <div>没有更多患者了</div>
            </div> -->
        </van-tabs>
    </div>
</body>

</html>
<script src="../script/set_root.js"></script>

<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/zepto.min.js"></script>
<script type="text/javascript" src="../script/hb.js"></script>
<script type="text/javascript" src="../script/vue.js"></script>
<script type="text/javascript" src="../script/vant.js"></script>
<script type="text/javascript">
    apiready = function () {
        hb_ready();
        initFunc();
    }

    function initFunc() {
        //使用vue对数据进行绑定
        var app = new Vue({
            el: '#app',
            data: {
                activeName: "1",
                list: [],
            },
            created: function () {
                if (api.pageParam.status) {
                    this.activeName = api.pageParam.status
                }
                this.initData();
            },
            methods: {
                initData: function () {
                    var $this = this;
                    get_ajax("doctor/consult/list/page/status", {
                        doctorId: $api.getStorage("emp").userId,
                        status: $this.activeName,
                        page: 1,
                        pagesize: 10,
                    }, function (res, err) {
                        if (res.code == 2000) {
                            $this.list = res.data.data
                        }
                    })
                },
                status: function (name, title) {
                    var $this = this;
                    get_ajax("doctor/consult/list/page/status", {
                        doctorId: $api.getStorage("emp").userId,
                        status: name,
                        page: 1,
                        pagesize: 10,
                    }, function (res, err) {
                        if (res.code == 2000) {
                            $this.list = res.data.data
                        }
                    })
                },
                change: function (id, userId) {
                    var that = this
                    get_ajax("doctor/consult/change", {
                        id: id
                    }, function (res, err) {
                        if (res.code == 2000) {
                            get_ajax("huanxin/im/doctor/friend/add", {
                                ownUser: $api.getStorage("emp").userId,
                                friendUser: userId,
                            }, function (ret, errs) {
                                if (ret.code == 2000) {
                                    //建立好友关系
                                    var easeChat = api.require('easeChat');
                                    easeChat.setAutoAcceptFriendInvitation({
                                        isAutoAcceptFriendInvitation: true
                                    });
                                    easeChat.addContact({
                                        name: "祥愿堂互联网医院",
                                        message: '欢迎问诊'
                                    }, function (ret, err) {
                                        if (ret.status) {
                                            toast('您与患者建立了医患关系');
                                        }
                                    });
                                }
                            });
                            that.initData()
                            // //发送监听事件
                            // api.sendEvent({
                          	// 	name: "",
                          	// 	extra: {}
                          	// });
                            api.openWin({
                                name: "chat",
                                url: "widget://html/chat/chat_win.html",
                                pageParam: {
                                    userId: userId,
                                    consultationId: id
                                }
                            })
                        }
                    })
                },
                goChat: function (item) {
                    api.openWin({
                        name: "chat",
                        url: "widget://html/chat/chat_win.html",
                        pageParam: {
                            userId: item.userId,
                            consultationId: item.id
                        }
                    })
                } //end
            },

        }); //endvue
    } //endfunc
</script>
